<template>
	<div class="safety_loop_detail">
		<div class="safety_loop">
			<span class="safety_loop_li">
				<img :src="shareImg">
				<div class="img_wrap">
					<span class="head" v-if="SocDetailTopData.empImg">
						<img :src="SocDetailTopData.empImg">
					</span>
					<span class="head" v-else="SocDetailTopData.empImg">
						<img src="../../assets/img/head_img.jpg">
					</span>
					<span class="iflike" :class="[SocDetailTopData.ifLike? 'ion_heart_red' : 'ion_heart_default']" @click="thumbsUp"></span>
					<h3>{{SocDetailTopData.shareTitle}}</h3>
				</div>
				<p class="author">by {{SocDetailTopData.empName}}</p>
				<footer class="foot clearFix">
					<span class="time"><i class="ion ion-android-time"></i>{{SocDetailTopData.shareTime}}</span>
					<span class="like"><i class="ion ion-ios-heart-outline"></i> {{SocDetailTopData.likeCount}}</span>
					<span class="classify"><i class="icon_mark"></i>{{SocDetailTopData.dataTypeText}}</span>
				</footer>
			</span>
		</div>

		<div class="article_con">
			<!-- <article class="con">
				<h4><i class="icon_disk blue_disk ion ion-ios-information-empty"></i>基本信息</h4>
				<p>观察者： {{SocContentData.empName}}</p>
				<p>被观察者： {{SocContentData.observeName}}</p>
				<p>部门： {{SocContentData.depName}}</p>
				<p>观察日期： {{SocContentData.observeTime}}</p>
			</article> -->
			<article class="con">
				<h4><i class="icon_disk green_disk ion ion-navicon"></i>谈话内容</h4>
				<p v-html="SocContentData.modifyTalk || '暂无谈话内容'"></p>
			</article>
			<article class="con">
				<h4><i class="icon_disk blue_disk ion ion-ios-cog-outline"></i>表扬或达成的共识</h4>
				<p v-html="SocContentData.modifyPraise || '暂无内容'"></p>
			</article>
			<article class="con">
				<h4><i class="icon_disk lightgreen_disk icon_image"></i>相关照片</h4>
				<p><img v-for ='img of observeImgs' :src="img"/></p>
			</article>
		</div>

	</div>
</template>
<script type="text/javascript">
	import getInterface from '../../assets/js/insterface.js'
	import PreviewImg from '../../assets/js/previewImg'

	export default{
		data(){
			return{
				SocDetailUrl:getInterface.getSocDetailUrl,
				SocDetailTopData:'',
				SocContentData:'',
				observeImgs:[],
				shareImg:''

			}
		},
		mixins:[PreviewImg],
		mounted(){
			document.title = 'Soc';
			this.$el.parentElement.parentNode.style.background = '#fafafa';
			this.getSocDetailData();
			let vue = this;
			setTimeout(()=>{
				vue.readImgInfo();
			},1100)
		},
		methods:{
			getSocDetailData(){
				// let param ={
				// 	id:this.$route.query.id,
				// 	empNo:this.$route.query.empNo
				// }

				this.$http.get(this.SocDetailUrl+this.$route.query.id+'/'+this.$route.query.empNo,{emulateJSON: true})
				.then((response) => {
					console.log(response)
					let resData = response.data;
					this.SocDetailTopData = resData.topData;
					this.SocContentData = resData.contentData;


					this.SocContentData.modifyTalk = this.SocContentData.modifyTalk.replace(/\r\n|\n/g,'<br/>');
					this.SocContentData.modifyPraise = this.SocContentData.modifyPraise.replace(/\r\n|\n/g,'<br/>');


					this.SocDetailTopData.shareTime = resData.topData.shareTime.substring(0,10);

					this.shareImg = resData.topData.shareImg.split(',')[0];
					// let shareImg = resData.topData.shareImg;
					// if(shareImg.indexOf(',') != -1){
					// 	resData.topData.shareImg = shareImg.substring(0,shareImg.indexOf(','));
					// }

					this.SocDetailTopData.ifLike = parseInt(resData.topData.ifLike);
					this.observeImgs = resData.contentData.observeImg.split(",");
					/*if(resData.topData.empImg == ''){
							this.SocDetailTopData.empImg = '/static/img/head.jpg'
						}*/
					switch(resData.topData.dataType){
						case 0:
							this.SocDetailTopData.dataTypeText = 'NM'
							break;
						case 1:
							this.SocDetailTopData.dataTypeText = 'safe to go'
							break;
						case 2:
							this.SocDetailTopData.dataTypeText = 'safety meeting'
							break;
						case 3:
							this.SocDetailTopData.dataTypeText = 'SOC'
							break;
					}
				})
			},
			thumbsUp(){
				if(this.SocDetailTopData.ifLike=="0"){
			    	let params = {id:this.SocDetailTopData.relationId,empNo:this.$route.query.empNo}

			    	this.$http.post(getInterface.isPraiseUrl,params,{emulateJSON: true})
			    	.then((response) => {
			    		console.log(response)
			    		
		    			if(response.data.type == "2"){
		    				console.log("点赞成功！")
					      	this.SocDetailTopData.ifLike = 1;
					      	if(this.SocDetailTopData.likeCount == undefined || this.SocDetailTopData.likeCount == null){
					      		this.SocDetailTopData.likeCount = 0;
					      	}
					      	this.SocDetailTopData.likeCount++;
					    }else{
					      	console.log("点赞失败！")
					    }
					    
			    	})
			    	.catch(function(response){
			    		console.log(response)
			    	})
		    	}else{
			    	console.log("您已点过赞！")
			    }
		    }
		}
	}
</script>